﻿@{
    Layout = "~/Views/Shared/_Form.cshtml";
}
<style>

    .table > thead > tr > th {
        background-color: rgb(24, 144, 255);
        color: rgb(255, 255, 255);
    }

    .fixed-table-toolbar {
        display: none;
    }

    .fontnumber {
        font-style: italic;
        font-size: 14px;
    }
</style>
<link href="/Content/plugin/bootstrap.table/1.12.0/bootstrap-table.min.css" rel="stylesheet" /> 
<section class="content">
    <div class="row">
        <div class="col-xs-12">
            <table id="gridTable" class="table table-hover text-nowrap">
            </table>
        </div>
    </div>
</section>
<script src="/Content/plugin/bootstrap.table/1.12.0/bootstrap-table.min.js"></script>
<script src="/Content/plugin/bootstrap.table/1.12.0/locale/bootstrap-table-zh-CN.js"></script>
<script src="/Content/framework/js/framework-bootstrap-table-plugin.js"></script>
<script type="text/javascript">
    var projectId = frame.request("projectId");
    var isInit = false;
    $(function () {
        initGrid();
    });
    function initGrid() {
        $('#gridTable').frameTable({
            url: '@Url.Action("GetOperateCostListJson", "Project")' + '?projectId=' + projectId,
            pagination: false,
            showFooter: true,
            columns: [
                {
                    field: 'Name', title: '成本名称', halign: "center", align: "center",
                    footerFormatter: function (data) {
                        return "成本合计(RMB)";
                    }
                }, 
                {
                    field: 'Amount', title: '成本费用', halign: "center", align: "center",
                    formatter: function (value, row, index) {
                        return "<span class='fontnumber text-green text-bold'>" + frame.formatCurrency(value, "CNY") + "</span>";
                    },
                    footerFormatter: function (rows) {
                        var sum = 0;
                        for (var i = 0; i < rows.length; i++) {
                            sum += rows[i].Amount;
                        }
                        return frame.formatCurrency(sum, "CNY");
                    }
                }
            ],
            onLoadSuccess: function (data) {
                if (data.Total == 0) {
                    isInit = true;
                }
            },
            onPostBody: function (data) {
                setTimeout(function () {
                    if (isInit && $(".fixed-table-body tbody tr.no-records-found").length) {
                        $(".fixed-table-footer").remove()
                    }
                    else {
                        //解决汇总列和内容页不对齐的问题
                        var bodyWith = [];
                        var table_body = $('.fixed-table-body table thead');
                        var body_tr = table_body.find('>tr');
                        var body_th = body_tr.find('>th');
                        for (var i = 0; i < body_th.length; i++) {
                            bodyWith.push(body_th.eq(i).find(".th-inner").width())
                        }
                        var footer_tbody = $('.fixed-table-footer table tbody');
                        var footer_tr = footer_tbody.find('>tr');
                        var footer_td = footer_tr.find('>td');
                        for (var i = 0; i < footer_td.length; i++) {
                            footer_td.eq(i).find(".fht-cell").css("width", bodyWith[i] + 'px');
                            footer_td.eq(i).css("font-weight", 'bold').css('font-size', '15px').css('font-style', 'italic').css('color', '#ff0000');
                        }
                    }
                }, 50);
            }
        });
    } 
</script>